import React from 'react'
import { withRouter } from 'react-router-dom'
import { connect } from 'dva'

import * as Constant from '../../constant'

import './style.css'

const OrderListItem = ({ history, order={}, dispatch }) => {
    const toInfo = () => {
        history.push(`/orderInfo/${order._id}`)
    }

    return (
        <div 
            className='orderListItem'
            onClick={toInfo}
        >
            {
                order.status !== Constant.ORDER_STATUS.ORDER_STATUS_REDAY && (
                    <div className='orderListItem-num'>
                        <div className='num'>订单编号: {order.orderNum}</div>
                        <div className='status'>
                            {Constant.ORDER_STATUS_TEXT[order.status]}
                        </div>
                    </div>
                )
            }
            <ul className='orderListItem-list'>
                {
                    Array.isArray(order.commodityList) && 
                    order.commodityList.map(item => (
                        <li key={item._id} >
                            <div>
                                <img src={item.banners[0]} />
                                <span className='orderListItem-list_name'>{item.title}</span>
                            </div>
                            <div>
                                <span>¥: {item.price}</span>
                                <span>x{item.count}</span>
                            </div>
                        </li>
                    ))
                }
            </ul>

            <div className='orderListItem-sum'>
                <span>总金额</span>
                <span>¥: {order.money}</span>
            </div>
        </div>
    )
}

export default connect()(withRouter(OrderListItem))

